{% extends "sales/base.html" %}
{% load static %}
{% load paginate %}
{% load thumbnail %}
{% block extralinks %}
<style>
  .form-group label {
    font-weight: 800;
  }
</style>
{% endblock %}
{% block content %}

<div class="main_container">
  
  <div class="row marl">
    <div class="col-lg-12 text-right">
      <span class="d-inline"><a class="primary_btn" href="{% url 'opportunities:save'%}"><i class="fa fa-plus"></i> Add
          New Opportunity</a></span>
    </div>
  </div>
  
  <div class="filter_row list_filter_row row marl">
    <div class="col-md-12">
      <div class="card">
        <div class="card-body">
          <form id="opportunity_filter" method="POST" action="">
            <div class="card-body ">
              <div class="card-title">Filters</div>
              <div class="row marl">
                <div class="filter_col col-md-2">
                  <div class="form-group">
                    <label for="exampleInputEmail1">Name</label>
                    <input type="text" class="form-control" placeholder="Name" id="id_name" name="name"
                      {% if request.POST %} value="{{request.POST.name}}" {% endif %}>
                  </div>
                </div>
                <div class="filter_col col-md-2">
                  <div class="form-group">
                    <label for="exampleInputEmail1">Account</label>
                    <select class="form-control" id="id_account" name="account">
                      <option value="">---------</option>
                      {% for l in accounts %}
                      <option value="{{l.id}}"
                        {% if request.POST.account %}{%ifequal l.id request.POST.account|add:"0"%}selected{%endifequal%}
                        {% endif %}>{{ l.name }}</option>
                      {% endfor %}
                    </select>
                  </div>
                </div>
                <div class="filter_col col-md-2">
                  <div class="form-group">
                    <label for="exampleInputEmail1">Stage</label>
                    <select class="form-control" id="id_stage" name="stage">
                      <option value="">---------</option>
                      {% for stage in stages %}
                      <option value="{{stage.0}}" {% if request.POST.stage %}
                        {% ifequal stage.0 request.POST.stage %}selected{% endifequal %} {% endif %}>{{stage.1}}
                      </option>
                      {% endfor%}
                    </select>
                  </div>
                </div>
                <div class="filter_col col-md-2">
                  <div class="form-group">
                    <label for="exampleInputEmail1">Lead Source</label>
                    <select class="form-control" id="id_lead_source" name="lead_source">
                      <option value="">---------</option>
                      {% for source in sources %}
                      <option value="{{source.0}}" {% if request.POST.lead_source %}
                        {% ifequal source.0 request.POST.lead_source %}selected{% endifequal %} {% endif %}>{{source.1}}
                      </option>
                      {% endfor%}
                    </select>
                  </div>
                </div>
                <div class="filter_col col-md-2">
                  <div class="form-group">
                    <label for="exampleInputEmail1">Tags</label>
                    <select class="form-control" id="id_tag" name="tag" multiple>
                      
                      {% for tag in tags %}
                      <option value="{{tag.id}}" {% if request_tags %}
                        {% if tag.id|slugify in request_tags %}selected{% endif %}{% endif %}>{{ tag.name }} </option>
                      {% endfor%}
                    </select>
                  </div>
                </div>
                <div class="filter_col text-left col-2">
                  <div class="form-group buttons_row">
                    <button class="btn btn-primary save" type="submit">Search</button>
                    <a href="{% url 'opportunities:list' %}" class="btn btn-default clear">Clear</a>
                  </div>
                </div>
              </div>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
  <div class="table_container_row row marl ">
    <div class="col-md-12">
      <div class="card">

        <div class="card-body">
          <div class="panel-heading-list card-title text-right">
            <span class="float-left">Opportunities - {% if show_pageitems %} {% show_pageitems %}{% else %}
              {{ opportunity_list|length }}{% endif %}</span>
            <span class="filter_toggle">
              <a href="#" class="primary_btn"><i class="fas fa-filter"></i></a>
            </span>

          </div>
          <div class="table-responsive">
            <table class="table ">
              <thead>
                {% if opportunity_list|length > 0 %}

                <tr>
                  <th width="5%">S.No</th>
                  <th width="10%">Name</th>
                  <th width="10%">Assigned To</th>
                  <th width="10%">Tags</th>
                  <th width="10%">Account</th>
                  
                  <th width="15%">Stage</th>
                  <th width="10%">Created On</th>
                  <th width="5%">Lead Source</th>
                  <th width="10%">Actions</th>
                </tr>
                {% endif %}
              </thead>
              <tbody>
                {% if per_page %}
                {% paginate per_page opportunity_list %}
                {% else %}
                {% paginate 10 opportunity_list %}
                {% endif %}
                {% for opportunity in opportunity_list %}
                <tr class="text-center">
                  <td scope="row">{{ forloop.counter }}</td>
                  <td><a href="#" data-toggle="modal"
                      data-target="#exampleModalCenter_opportunity{{opportunity.id}}">{{ opportunity.name }}</a></td>
                  <td>
                    {% with opportunity_users=opportunity.get_team_and_assigned_users %}
                    {% for user in opportunity_users %}
                    {% if user.profile_pic %}
                    {% thumbnail user.profile_pic "40x40" crop="center" as im %}
                    <a href="{% url 'common:view_user' user.id %}">
                      <img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}" title="{{ user.email }}">
                    </a>
                    {% endthumbnail %}
                    {% else %}
                    <a href="{% url 'common:view_user' user.id %}">
                      <img src="{% static 'images/user.png' %}" title="{{ user.email }}" width="40" height="40">
                    </a>
                    {% endif %}
                    {% empty %}
                    None
                    {% endfor %}
                    {% endwith %}
                  </td>
                  <td>
                    {% with tags=opportunity.tags.all %}
                    {% if tags %}
                    {% for tag in tags %}
                    <span class="text-left color{{forloop.counter}} tag_class_opp" data-link="{{tag.id}}"
                      style="cursor: pointer;" id="list_tag">{{ tag.name }}</span>
                    {% endfor %}
                    {% else %}
                    No Tags
                    {% endif %}
                    {% endwith %}
                  </td>
                  <td>
                    {% if opportunity.account %}
                    <a href="{% url  'accounts:view_account' opportunity.account.id %}">{{ opportunity.account }}</a>
                    {% else %}
                    No Related Account
                    {% endif %}
                  </td>
                  
                  <td>{% if opportunity.stage %}{{ opportunity.stage }}{% else %}Not Specified {% endif %}</td>
                  <td title="{{opportunity.created_on}}">{{opportunity.created_on_arrow}}</td>
                  <td>{% if opportunity.lead_source %}{{ opportunity.lead_source }}{% else %}Not Specified{% endif %}
                  </td>
                  <td class="actions">
                    <a href="{% url 'opportunities:opp_view' opportunity.id %}" class="btn btn-info view"  title="View"><i
                        class="fas fa-eye"></i></a>
                    <a href="{% url 'opportunities:opp_edit' opportunity.id %}" class="btn btn-success edit" title="Edit" ><i
                        class="fas fa-pencil-alt"></i></a>
                    {% if request.user == opportunity.created_by or request.user.role == "ADMIN" or request.user.is_superuser %}
                    <a href="{% url 'opportunities:opp_remove' opportunity.id %}"
                      class="btn btn-danger delete remove_account" title="Delete"><i class="fas fa-trash-alt"></i></a>
                    {% endif %}
                  </td>
                </tr>
                {% endfor %}
              </tbody>
            </table>
          </div>
          {% ifequal opportunity_list|length 0 %}
          <h6 class="text-center">No Opportunity Records Found</h6>
          {% endifequal %}
          <div class="marl row text-center">
            {% show_pages %}
          </div>
        </div>

      </div>
    </div>
    <br clear="all">
  </div>
  

</div>


{% for opportunity_record in opportunity_list %}

<div class="modal fade" id="exampleModalCenter_opportunity{{opportunity_record.id}}" tabindex="-1" role="dialog"
  aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLongTitle">{{ opportunity_record.name }}</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        
        <div class="" id="">
          <div class="">
            <div class="col-md-12" id="">
              <div class="card">
                <div class="card-body" id="datashow" style="margin: 0; padding: 0;">
                  <div class="card-title text-right">
                    <h5>
                      
                      <span class="" style="margin-top: 0px">
                        
                      </span>
                    </h5>
                  </div>
                  <div class="row marl">
                    <div class="col-md-4">
                      <div class="filter_col col-md-12" id="iname">
                        <div class="form-group">
                          <label class="opportunity_field_label" for="id_name" data-name="name">Name</label>
                          <div class="opportunity_field" id="opportunity_name" data-name="name">
                            {{ opportunity_record.name }}
                          </div>
                        </div>
                      </div>
                      <div class="filter_col col-md-12">
                        <div class="form-group">
                          <label class="opportunity_field_label" for="id_opportunity_account"
                            data-name="name">Account</label>
                          <div class="opportunity_field" id="opportunity_account" data-name="name">
                            {{ opportunity_record.account }}</div>
                        </div>
                      </div>
                      <div class="filter_col col-md-12">
                        {% if opportunity_record.contacts.all %}
                        <div class="form-group">
                          <label class="opportunity_field_label" for="id_contact" data-name="name">Contact(s)</label>
                          <div class="opportunity_field" id="opportunity_contact" data-name="name">
                            {% for contact in opportunity_record.contacts.all %}
                            <li>{{ contact }}</li>
                            {% endfor %}
                          </div>
                        </div>
                        {% endif %}
                      </div>
                      <div class="filter_col col-md-12">
                        {% if opportunity_record.amount %}
                        <div class="form-group">
                          <label class="opportunity_field_label" for="id_amount" data-name="name">Amount</label>
                          <div class="opportunity_field" id="opportunity_amount" data-name="name">
                            {{ opportunity_record.currency }} {{ opportunity_record.amount }}</div>
                        </div>
                        {% endif %}
                      </div>
                    </div>
                    <div class="col-md-4">
                      <div class="filter_col col-md-12">
                        {% if opportunity_record.stage %}
                        <div class="form-group">
                          <label class="opportunity_field_label" for="id_stage" data-name="name">Stage</label>
                          <div class="opportunity_field" id="opportunity_stage" data-name="name">
                            {{ opportunity_record.stage }}
                          </div>
                        </div>
                        {% endif %}
                      </div>
                      <div class="filter_col col-md-12">
                        {% if opportunity_record.lead_source %}
                        <div class="form-group">
                          <label class="opportunity_field_label" for="id_lead_source" data-name="name">Lead
                            Source</label>
                          <div class="opportunity_field" id="opportunity_lead_source" data-name="name">
                            {{ opportunity_record.lead_source }}</div>
                        </div>
                        {% endif %}
                      </div>
                      <div class="filter_col col-md-12">
                        {% if opportunity_record.probability %}
                        <div class="form-group">
                          <label class="opportunity_field_label" for="id_probability"
                            data-name="name">Probability</label>
                          <div class="opportunity_field" id="opportunity_probability" data-name="name">
                            {{opportunity_record.probability}} %</div>
                        </div>
                        {% endif %}
                      </div>
                      <div class="filter_col col-md-12">
                        {% if opportunity_record.closed_on %}
                        <div class="form-group">
                          <label class="opportunity_field_label" for="id_close_date" data-name="name">Close Date</label>
                          <div class="opportunity_field" id="opportunity_close_date" data-name="name">
                            {{opportunity_record.closed_on|date}}</div>
                        </div>
                        {% endif %}
                      </div>
                    </div>
                    <div class="col-md-4">
                      {% if opportunity_record.tags.all %}
                      <div class="filter_col col-md-12">
                        <div class="form-group">
                          <label class="acc_field_label" for="id_tags" data-name="name">Tags</label>
                          <div class="account_field" id="account_tags" data-name="name">
                            {% for tag in opportunity_record.tags.all %}
                            <span class="text-left" id="list_tag">{{ tag.name }}</span>
                            {% endfor %}
                          </div>
                        </div>
                      </div>
                      {% endif %}
                    </div>
                    <div class="col-md-12">
                      {% if opportunity_record.description %}
                      <div class="filter_col col-md-12">
                        <div class="form-group">
                          <label class="opportunity_field_label" for="id_description"
                            data-name="name">Description</label>
                          <div class="opportunity_field" id="opportunity_description" data-name="name">
                            {{opportunity_record.description}}</div>
                        </div>
                      </div>
                      {% endif %}
                      <div class="created_information">
                        Created by <b>{{ opportunity_record.created_by }}</b> created on
                        <b title="{{ opportunity_record.created_on }}">{{ opportunity_record.created_on_arrow }}</b>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    
  </div>
</div>


{% endfor %}

{% endblock %}
{% block js_block %}
<script type="text/javascript">
  $(document).ready(function () {
    $(".filter_toggle").click(function () {
      $(".list_filter_row").toggle();
    });
    $('#id_tag').select2();
    $('#id_account').select2();
  });

  $(".tag_class_opp").click(function () {
    // $(".tag_class_opp").css('cursor', 'pointer')
    url = "{% url 'opportunity:list' %}"
    url = url + "?tag=" + $(this).attr('data-link')
    window.location.href = url;
  });

  search = "{{search}}"

  if (search == 'True') {
    $(".list_filter_row").show();
  }

  $('.delete').click(function (e) {
    e.preventDefault()
    url = $(this).attr('href')
    if (!confirm('Are you sure you want to delete?'))
      return;
    window.location = $(this).attr('href')
  });

  $("a[rel='page']").click(function (e) {
    e.preventDefault();
    $('#opportunity_filter').attr("action", $(this).attr("href"));
    $('#opportunity_filter').submit();
  });
</script>
{% endblock js_block %}